<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>jQuery Selectors Tests</title>
<link type="text/css" rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css">
<link type="text/css" rel="stylesheet" href="jquery.maxlengthui.css">
<script type="text/javascript" src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript" src="jquery.selectors.js"></script>
<script type="text/javascript">
var counts = {};

function xtest () {}

$(function() {
	test('Content', function() {
		expect(6);
		var elems = $('#qunit-fixture p:content("One (1)")');
		equal(elems.length, 1, 'p:content("One (1)") - length');
		equal(getIDs(elems), 'p1', 'p:content("One (1)") - ID');
		elems = $('#qunit-fixture li:content(Entry 1.2)');
		equal(elems.length, 1, 'li:content(Entry 1.2) - length');
		equal(getIDs(elems), 'l12', 'li:content(Entry 1.2) - ID');
		elems = $('#qunit-fixture li:content(Entry)');
		equal(elems.length, 0, 'li:content(Entry) - length');
		equal(getIDs(elems), '', 'li:content(Entry) - ID');
	});

	test('Matches', function() {
		expect(12);
		var elems = $('#qunit-fixture p:matches(One)');
		equal(elems.length, 1, 'p:matches(One) - length');
		equal(getIDs(elems), 'p1', 'p:matches(One) - ID');
		elems = $('#qunit-fixture p:matches(Fo|Fi)');
		equal(elems.length, 2, 'p:matches(Fo|Fi) - length');
		equal(getIDs(elems), 'p4,p5', 'p:matches(Fo|Fi) - ID');
		elems = $('#qunit-fixture p:matches("[aeiou].*[aeiou]")');
		equal(elems.length, 3, 'p:matches("[aeiou].*[aeiou]") - length');
		equal(getIDs(elems), 'p3,p4,p5', 'p:matches("[aeiou].*[aeiou]") - ID');
		elems = $('#qunit-fixture p:matches(~[aeiou].*[aeiou])');
		equal(elems.length, 4, 'p:matches(~[aeiou].*[aeiou]) - length');
		equal(getIDs(elems), 'p1,p3,p4,p5', 'p:matches(~[aeiou].*[aeiou]) - ID');
		elems = $('#qunit-fixture p:matches("(4)")');
		equal(elems.length, 1, 'p:matches("(4)") - length');
		equal(getIDs(elems), 'p4', 'p:matches("(4)") - ID');
		elems = $('#qunit-fixture li:matches(1\\.\\d)');
		equal(elems.length, 4, 'li:matches(1\\.\\d) - length');
		equal(getIDs(elems), 'l1,l11,l12,l13', 'li:matches(1\\.\\d) - ID');
	});

	test('Foreign', function() {
		expect(4);
		var elems = $('#qunit-fixture p:foreign');
		equal(elems.length, 2, 'p:foreign - length');
		equal(getIDs(elems), 'p2,p3', 'p:foreign - ID');
		elems = $('#qunit-fixture p:foreign(fr)');
		equal(elems.length, 1, 'p:foreign(fr) - length');
		equal(getIDs(elems), 'p2', 'p:foreign(fr) - ID');
	});

	test('Lists', function() {
		expect(2);
		var elems = $('#qunit-fixture :list');
		equal(elems.length, 5, ':list - length');
		equal(getIDs(elems), 'selectors,u1,u2,u3,o1', ':list - ID');
	});

	test('Emphasis', function() {
		expect(4);
		var elems = $('#qunit-fixture :emphasis');
		equal(elems.length, 2, ':emphasis - length');
		equal(getIDs(elems), 'em1,b1', ':emphasis - ID');
		elems = $('#qunit-fixture p:has(:emphasis)');
		equal(elems.length, 2, 'p:has(:emphasis) - length');
		equal(getIDs(elems), 'p1,p3', 'p:has(:emphasis) - ID');
	});

	test('Middle', function() {
		expect(4);
		var elems = $('#qunit-fixture p:middle');
		equal(elems.length, 3, 'p:middle - length');
		equal(getIDs(elems), 'p2,p3,p4', 'p:middle - ID');
		elems = $('#qunit-fixture input:radio:middle');
		equal(elems.length, 0, 'input:radio:middle - length');
		equal(getIDs(elems), '', 'input:radio:middle - ID');
	});

	test('Eq(-)', function() {
		expect(8);
		var elems = $('#qunit-fixture p:eq(-1)');
		equal(elems.length, 1, 'p:eq(-1) - length');
		equal(getIDs(elems), 'p5', 'p:eq(-1) - ID');
		elems = $('#qunit-fixture p:eq(-4)');
		equal(elems.length, 1, 'p:eq(-4) - length');
		equal(getIDs(elems), 'p2', 'p:eq(-4) - ID');
		elems = $('#qunit-fixture p:eq(1)');
		equal(elems.length, 1, 'p:eq(1) - length');
		equal(getIDs(elems), 'p2', 'p:eq(1) - ID');
		elems = $('#qunit-fixture p:eq(4)');
		equal(elems.length, 1, 'p:eq(4) - length');
		equal(getIDs(elems), 'p5', 'p:eq(4) - ID');
	});

	test('Validate', function() {
		expect(8);
		var elems = $(':checkbox:unchecked, :radio:unchecked', '#qunit-fixture');
		equal(elems.length, 2, ':unchecked - length');
		equal(getIDs(elems), 'i2,i4', ':unchecked - ID');
		elems = $(':checkbox:checked, :radio:checked', '#qunit-fixture');
		equal(elems.length, 2, ':checked - length');
		equal(getIDs(elems), 'i1,i3', ':checked - ID');
		elems = $(':password:blank, :text:blank', '#qunit-fixture ');
		equal(elems.length, 1, ':blank - length');
		equal(getIDs(elems), 'i6', ':blank - ID');
		elems = $(':password:filled, :text:filled', '#qunit-fixture ');
		equal(elems.length, 1, ':filled - length');
		equal(getIDs(elems), 'i5', ':filled - ID');
	});
});

function getIDs(elems) {
	return elems.map(function() { return this.id; }).get().join(',');
}
</script>
</head>

<body>
<div id="qunit"></div>
<div id="qunit-fixture">
	<h3 id="h3">Header</h3>
	<p id="p1" lang="en"><em id="em1">One (1)</em></p>
	<p id="p2" lang="fr">Two (2)</p>
	<p id="p3" lang="de"><b id="b1">Three (3)</b></p>
	<p id="p4">Four (4)</p>
	<p id="p5">Five (5)</p>
	<ul id="selectors">
		<li id="l1">Entry 1
			<ul id="u1">
				<li id="l11" class="linked"><a href="#">Entry 1.1</a> - description</li>
				<li id="l12">Entry 1.2</li>
				<li id="l13">Entry 1.3</li>
			</ul>
		</li>
		<li id="l2">Entry 2
			<ul id="u2">
				<li id="l21">Entry 2.1</li>
				<li id="l22" class="linked"><a href="#">Entry 2.2</a> - description</li>
				<li id="l23">Entry 2.3</li>
			</ul>
		</li>
		<li id="l3">Entry 3
			<ul id="u3">
				<li id="l31">Entry 3.1</li>
				<li id="l32">Entry 3.2</li>
				<li id="l33" class="linked"><a href="#">Entry 3.3</a> - description</li>
			</ul>
		</li>
	</ul>
	<ol id="o1">
		<li>Ordered</li>
	</ol>
	<input type="radio" id="i1" name="radio" checked>
	<input type="radio" id="i2" name="radio">
	<input type="checkbox" id="i3" checked>
	<input type="checkbox" id="i4">
	<input type="text" id="i5" value="xxx">
	<input type="password" id="i6">
	<select id="s1">
		<option id="op1">One</option>
		<option id="op2" selected>Two</option>
	</select>
</div>
</body>
</html>
